/*模拟元素*/

input[type="radio"]+ins {
    display: inline-block;
    vertical-align: middle;
    width: 20px;
    height: 20px;
    cursor: pointer;
    background: url("data:img/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAQAAAC1QeVaAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QA/4ePzL8AAAAHdElNRQfhChILBwN7cc2uAAAA0klEQVQY03XQL0sDARzH4edu/gmCltMgWGXhcLL3MNNmubQ3IA5MBvFNCGI7y9qCeGW6pC9gUUG2BbGYNgaigsiSQWY4zk994AffX5ACkWN12xjpujCFECQGVhyIRA6tGUpgAYlzex5+T+jra7tBFqTrBmp/NK/iTlxqnHrWlm9sSzW0r6OojnqQfls1K8BlH6H/WjQLjVQLMfYS6moWYlMvSDc8qXnM0Y57cWii5dZubmVPy6TUYOjVlU1T75ZUnDhzJJv/9lrZl7Y3Y5c+lWXwA42VNSUN5tCkAAAAAElFTkSuQmCC") center no-repeat;
}

input[type="radio"]:checked+ins {
    background-image: url("data:img/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAMAAAAolt3jAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAXVBMVEUAZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv////8lqmsDAAAAHXRSTlMAFIbS+NCCU/Dx/hUW+W4SEW9383bRVPLT+vTOg0P723MAAAABYktHRB5yCiArAAAAB3RJTUUH4QoSCwczXaj9AgAAAGlJREFUCNddj1cSgCAMRBcEEQWxd+5/TQO2wf1I9s2kAgDjmRAyZ4hShY/SKlLpb5XElfavtEFOydauqS0ZDkmxDU0dmQyCogvoQlmK/Vc8kBnvUc0zyqSLfmcA03zRrK6jGV/WbT/CCyf57AyvO5l8kQAAAABJRU5ErkJggg==");
}

input[type="radio"]:checked:disabled+ins {
    background-image: url("");
}

input[type="checkbox"]+ins {
    display: inline-block;
    vertical-align: middle;
    width: 20px;
    height: 20px;
    cursor: pointer;
    background: url("data:img/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAQAAAC1QeVaAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QA/4ePzL8AAAAHdElNRQfhChILBA4u7eLQAAAARUlEQVQY02Oc6ckwl0GSARM8Z0hmYpjLEMbAiAWGMcxlnPmfgZEBO/jPxIAHjBzJ5ww2WGWsGV6wMKQwrGaQwCL5lCEZACr0DDyRjrz8AAAAAElFTkSuQmCC") center no-repeat;
}

input[type="checkbox"]:checked+ins {
    background-image: url("data:img/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOBAMAAADtZjDiAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAHlBMVEUAZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv8AZv////9gtIddAAAACHRSTlMASeaAf+dK5CWP3QcAAAABYktHRAnx2aXsAAAAB3RJTUUH4QoSCwUTVPC/SAAAADtJREFUCNdjEOoAAUUGDTDdxNABASh0swWENvAA0s0WzSwg8RZmIBck7sACUdfiga4PREPMbWVIBdNlAPt8Ljrffa/BAAAAAElFTkSuQmCC");
}

input[type="checkbox"]:checked:disabled+ins {
    background-image: url("");
}

input[type="radio"]:disabled+ins,
input[type="checkbox"]:disabled+ins {
    cursor: not-allowed;
    cursor: -ms-not-allowed;
}

input[type="number"],
input[_type="number"] {
    padding-right: 0 !important;
    vertical-align: middle;
}

input[type="number"]+ins,
input[_type="number"]+ins {
    display: inline-block;
    margin-left: -22px;
    width: 20px;
    height: 26px;
    vertical-align: middle;
}

.ins-add,
.ins-minus {
    display: block;
    width: 100%;
    height: 50%;
}

.ins-add {
    background: #FFFFFF url("data:img/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAFCAQAAADWbbXjAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QA/4ePzL8AAAAHdElNRQfhChILAiM9aBkjAAAAUElEQVQI1zXIoRFAAAAAwEeQOYo1NKxhAncU2yiaagB3oqBZwCCSJvn4QQ/EJoHRCyEoHFKJQ/Fn5bJptTaXiqgczDoLON1WTyjT2P12tfwD8+0P1/fEPRAAAAAASUVORK5CYII=") center no-repeat;
}

.ins-minus {
    background: #FFFFFF url("data:img/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAFCAQAAADWbbXjAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QA/4ePzL8AAAAHdElNRQfhChILBTIYma8WAAAAWklEQVQI10XIoRGCUAAA0PeR4BBEJ9DyI0YW4JjAHTgamxA9Akt8zuII1t/0dAQbvPjCbXD3sjvpCh9Js1UjeR8uTw+To1XQG7WWEqtodkYlyhQgu/r6qWX4A96IE1RS2OsDAAAAAElFTkSuQmCC") center no-repeat;
}

.ins-add:active,
.ins-minus:active {
    background-color: #EEEEEE;
}

.select-wl {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    padding: 0 !important;
    border: none !important;
    dt:before {
        content: attr(label);
    }
    .select-input {
        display: block;
        width: 100%;
        padding-right: 30px;
    }
    .edge {
        display: inline-block;
        width: 0;
        height: 0;
        border-width: 6px;
        border-style: dashed;
        border-color: transparent;
        overflow: hidden;
        border-width: 6px;
        border-top-color: #c2c2c2;
        border-top-style: solid;
        cursor: pointer;
        vertical-align: middle;
        transition: all .3s;
        position: absolute;
        right: 10px;
        top: 50%;
        margin-top: -3px;
    }
    dl {
        display: none;
        position: fixed !important;
        padding: 5px 0;
        z-index: 999999999;
        border: 1px solid #d2d2d2;
        max-height: 200px;
        overflow-y: auto;
        background-color: #fff;
        border-radius: 4px;
        box-shadow: 0 2px 4px rgba(0, 0, 0, .12);
        box-sizing: border-box;
    }
    [data-type="button-group"] {
        dd:first-of-type {
            display: none;
        }
    }
    dd,
    dt {
        padding: 0 10px;
        line-height: 30px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 14px;
    }
    dt {
        color: #999
    }
    dd {
        cursor: pointer;
        &:hover {
            background-color: #f2f2f2
        }
        &[selected] {
            background-color: #5FB878;
            color: #fff
        }
        &[disabled] {
            cursor: default;
            background-color: #fff;
            color: #999
        }
    }
    dt~dd {
        padding-left: 20px;
    }
    &.select-unfold {
        dl {
            display: block;
        }
    }
    .slimScrollDiv {
        display: none;
        position: fixed !important;
        //position: absolute !important;
        //left: 0;
        //top: 34px;
        //min-width: 100%;
        z-index: 999;
        dl {
            position: static;
            left: auto;
            top: auto;
        }
    }
    &.select-unfold {
        .slimScrollDiv {
            display: block;
        }
    }
}

select[disabled]+.select-wl .edge,
select[disabled]+.select-wl .select-input {
    cursor: not-allowed;
}

select[disabled]+.select-wl dl {
    display: none !important;
}

select[lay-ignore] {
    display: inline-block !important;
}

select[lay-ignore]+.select-wl {
    display: none !important;
}

.no-mate {
    dl:after {
        content: '没有匹配结果';
        display: block;
        padding: 0 10px;
        line-height: 20px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 14px;
        background-color: #fff;
        color: #999;
        text-align: center;
    }
}

.m-scroll {
    overflow: auto;
    box-sizing: border-box;
}

.slimScrollRail {
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    border-radius: 5px !important;
    background-color: #F5F5F5 !important;
    opacity: 1 !important;
}

.slimScrollBar {
    border-radius: 5px !important;
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    background-color: #CCCCCC !important;
    opacity: 1 !important;
}

@borderC: #E6EAEE;
.m-table {
    overflow: auto;
    border: 1px solid @borderC;
    table {
        border-collapse: collapse;
        min-width: 100%;
    }
    td,
    th {
        box-sizing: border-box;
        border-right: 1px solid @borderC;
        border-bottom: 1px solid @borderC;
        padding: 0 10px;
    }
    tr:first-of-type {
        th,
        td {
            border-top: none;
        }
    }
    tr:last-of-type {
        th,
        td {
            border-bottom: none;
            &:before {
                border-bottom: none !important;
            }
        }
    }
    td:first-of-type {
        border-left: none;
    }
    td:last-of-type {
        border-right: none;
        &:before {
            border-right: none !important;
        }
    }
    .thead {
        white-space: nowrap;
    }
    .tbody {
        word-break: break-all;
        word-wrap: break-word;
    }
}

.m-table[data-wl] .thead td {
    padding: 0;
    >div {
        display: inline-block;
        padding: 0 10px;
    }
}

[data-wl] .fixed-top td,
[data-wl] .fixed-bottom td,
[data-wl] .fixed-left,
[data-wl] .fixed-right {
    position: relative;
    //background: #FFFFFF;
    //-ms-transition: all 0.1s;
    &:before {
        content: '';
        box-sizing: content-box;
        width: 100%;
        height: 100%;
        background: #FFFFFF;
        border-right: 1px solid @borderC;
        border-bottom: 1px solid @borderC;
        position: absolute;
        left: 0;
        top: 0;
        z-index: -1;
    }
}

[data-wl] .fixed-bottom td {
    &:before {
        border-top: 1px solid @borderC;
        top: -1px;
    }
}

[data-wl] .fixed-top td,
[data-wl] .fixed-bottom td {
    z-index: 1;
}

[data-wl] table .fixed-left,
[data-wl] table .fixed-right {
    z-index: 2;
}

[data-wl] .fixed-top .fixed-left,
[data-wl] .fixed-bottom .fixed-right {
    z-index: 3;
}

//模拟title
[_title] {
    position: relative;
    &::after {
        content: attr(_title);
        white-space: pre-wrap;
        display: none;
    }
    &:hover {
        &::after {
            display: block;
            position: absolute;
            left: 0;
            top: 100%;
            padding: 2px 4px;
            color: #666666;
            background: #EEEEEE;
            border: 1px solid #CCCCCC;
            border-radius: 2px;
        }
    }
}